<template>

	<img src="/static/suyuan/首.jpg" alt="" />
	<p class="xiaobiaoti">溯源信息</p>
	<el-table :data="suyuanxinxi" border class="biaoge">
		<el-table-column prop="date" label="产品名称" width="110" />
		<el-table-column prop="name" label="肇庆裹蒸粽" width="180" />
	</el-table>

	<p class="xiaobiaoti">企业信息</p>
	<el-table :data="qiyexinxi" border class="biaoge">
		<el-table-column prop="date" label="公司名称" width="110" />
		<el-table-column prop="name" label="肇肇庆市鼎湖华记裹蒸粽食品有限公司" width="180" />
	</el-table>

	<p class="xiaobiaoti">产品详情</p>
	<img src="/static/suyuan/1.jpg" />
	<img src="/static/suyuan/2.jpg" />
	<img src="/static/suyuan/3.jpg" />
	<img src="/static/suyuan/4.jpg" />
	<img src="/static/suyuan/5.jpg" />
	<img src="/static/suyuan/6.jpg" />
	<img src="/static/suyuan/7.jpg" />
	<img src="/static/suyuan/8.jpg" />
	<img src="/static/suyuan/9.jpg" />
	<img src="/static/suyuan/10.jpg" />
	<img src="/static/suyuan/11.jpg" />
</template>

<script lang="ts" setup>
	const suyuanxinxi = [{
		date: '零售价格',
		name: '11元/只',
	},
	{
		date: '出厂日期',
		name: '2025-05-24',
	},
	{
		date: '净含量',
		name: '200g',
	},
	{
		date: '产地',
		name: '广东肇庆',
	},
	{
		date: '品牌',
		name: '桂城华记',
	},
	{
		date: '馅料',
		name: '蛋黄肉粽',
	},
	{
		date: '包装方式',
		name: '真空包装',
	},
	]

	const qiyexinxi = [{
		date: '公司地址',
		name: '肇庆市鼎湖区桂城水坑二市场侧边',
	},
	{
		date: '成立日期',
		name: '2011-01-13',
	},
	{
		date: '注册资本',
		name: '200万',
	},

	]
</script>

<style>
	img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}

	.xiaobiaoti {
		color: #ff5500;
		margin: 15px 0 10px 20px;
		font-size: 20px;
		font-weight: 700;
		border-left: 3px solid #ff5500;
		padding-left: 10px;
	}

	.biaoge {
		width: 90%;
		margin: 0 auto;
	}
</style>